<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
  <meta http-equiv="content-type" content="text/html; charset=UTF-8">
  <title>Usama Khan</title>

<link type="text/css" href="css/atooltip.css" rel="stylesheet"  media="screen" />
        
        
        <!-- Scripts -->
        <script type="text/javascript" src="js/jquery-1.3.2.min.js"></script>
        
        <!-- aToolTip js -->
        <script type="text/javascript" src="js/jquery.atooltip.js"></script>
  
  <style type='text/css'>
    .magnfy {
    font-size: 45px;
    /* This controls the size. */
    display: inline-block;
    width: 0.4em;
    height: 0.4em;
    border: 0.1em solid red;
    position: relative;
    border-radius: 0.35em;
    z-index:10;
    cursor:pointer;
}
.magnfy::before {
    content:"";
    display: inline-block;
    position: absolute;
    right: -0.25em;
    bottom: -0.1em;
    border-width: 0;
    background: red;
    width: 0.35em;
    height: 0.08em;
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    -o-transform: rotate(45deg);
}
#container {
    width: 2108px;
    height: 2471px;
    position:relative;	
    margin: auto;
    }

#container img {
    padding:5px
}
tr:hover td {
    background: none repeat scroll 0 0 brown;

}
#sample1 {
    position: absolute;
    top: 382px;
    left: 374px;
}
#sample2 {
    position: absolute;
    top: 486px;
    left: 500px;
}
#sample3 {
    position: absolute;
    top: 388px;
    left: 982px;
}
#sample4 {
    position: absolute;
    top: 488px;
    left: 1420px;
}
#sample5 {
    position: absolute;
    top: 388px;
    left: 1572px;
}
#sample6 {
    position: absolute;
    top: 776px;
    left: 1660px;
}
#sample7 {
    position: absolute;
    top: 776px;
    left: 1250px;
}
#sample8 {
    position: absolute;
    top: 1194px;
    left: 1133px;
}
#sample9 {
    position: absolute;
    top: 1195px;
    left: 726px;
}

#sample10{
    position: absolute;
    top: 1461px;
    left: 463px;
}
#sample11 {
    position: absolute;
    top: 1461px;
    left: 1051px;
}

#sample12 {
    position: absolute;
    top: 1646px;
    left: 572px;
}
#sample13 {
    position: absolute;
    top: 1646px;
    left: 951px;
}
#sample14 {
    position: absolute;
    top: 2084px;
    left: 1330px;
}
#sample15 {
    position: absolute;
    top: 2408px;
    left: 838px;
}
#sample16 {
    position: absolute;
    top: 2408px;
    left: 566px;
  </style>
  


</head>
<body>
  <div id="container">
    <img src="images/uk_web.png" />
    <div id="sample1"> <a rel="sample1-content" href="#" class="magnfy"></a></div>
    <div id="sample2"> <a rel="sample2-content" href="#" class="magnfy"></a></div>
    <div id="sample3"> <a rel="sample3-content" href="#" class="magnfy"></a></div>
    <div id="sample4"> <a rel="sample4-content" href="#" class="magnfy"></a></div>
    <div id="sample5"> <a rel="sample5-content" href="#" class="magnfy"></a></div>
    <div id="sample6"> <a rel="sample6-content" href="#" class="magnfy"></a></div>
    <div id="sample7"> <a rel="sample7-content" href="#" class="magnfy"></a></div>
    <div id="sample8"> <a rel="sample8-content" href="#" class="magnfy"></a></div>
    <div id="sample9"> <a rel="sample9-content" href="#" class="magnfy"></a></div>
    <div id="sample10"> <a rel="sample10-content" href="#" class="magnfy"></a></div>
    <div id="sample11"> <a rel="sample11-content" href="#" class="magnfy"></a></div>
    <div id="sample12"> <a rel="sample12-content" href="#" class="magnfy"></a></div>
    <div id="sample13"> <a rel="sample13-content" href="#" class="magnfy"></a></div>
    <div id="sample14"> <a rel="sample14-content" href="#" class="magnfy"></a></div>
    <div id="sample15"> <a rel="sample15-content" href="#" class="magnfy"></a></div>
    <div id="sample16"> <a rel="sample16-content" href="#" class="magnfy"></a></div>
</div>

  <div id="sample1-content" style="display:none">
    <table cellpadding="5" border="1">
      <tbody>
        <tr>
          <th>Parameter</th>

          <th>Normal Range</th>

          <th>Frequency</th>
        </tr>

        <tr>
          <td>Temperature</td>

          <td>50-60°C</td>

          <td>per day</td>
        </tr>

        <tr>
          <td>NaCl Concentration</td>

          <td>above 290g/L</td>

          <td>per day</td>
        </tr>

        <tr>
          <td>Av. Cl<sub>2</sub></td>

          <td>nil</td>

          <td>per day</td>
        </tr>
      </tbody>
    </table>
  </div>

  <div id="sample2-content" style="display:none">
    <table cellpadding="5" border="1">
      <tbody>
        <tr>
          <th>Parameter</th>

          <th>Normal Range</th>

          <th>Frequency</th>
        </tr>

        <tr>
          <td>SO<sub>4</sub><sup>-2</sup></td>

          <td>7-8.5g/L</td>

          <td>per day</td>
        </tr>
      </tbody>
    </table>
  </div>

  <div id="sample3-content" style="display:none">
    <table cellpadding="5" border="1">
      <tbody>
        <tr>
          <th>Parameter</th>

          <th>Normal Range</th>

          <th>Frequency</th>
        </tr>

        <tr>
          <td>Turbidity (overhead)</td>

          <td>50NTU</td>

          <td>per shift</td>
        </tr>

        <tr>
          <td>Ba<sup>+2</sup> (in sludge)</td>

          <td>?</td>

          <td>per day</td>
        </tr>
      </tbody>
    </table>
  </div>

  <div id="sample4-content" style="display:none">
    <table cellpadding="5" border="1">
      <tbody>
        <tr>
          <th>Parameter</th>

          <th>Normal Range</th>

          <th>Frequency</th>
        </tr>

        <tr>
          <td>OH<sup>-1</sup></td>

          <td>per day</td>

          <td>per hour</td>
        </tr>

        <tr>
          <td>CO<sub>3</sub><sup>-2</sup></td>

          <td>per day</td>

          <td>per hour</td>
        </tr>
      </tbody>
    </table>
  </div>

  <div id="sample5-content" style="display:none">
    <table cellpadding="5" border="1">
      <tbody>
        <tr>
          <th>Parameter</th>

          <th>Normal Range</th>

          <th>Frequency</th>
        </tr>

        <tr>
          <td>OH<sup>-1</sup></td>

          <td>per day</td>

          <td>per hour</td>
        </tr>

        <tr>
          <td>CO<sub>3</sub><sup>-2</sup></td>

          <td>per day</td>

          <td>per hour</td>
        </tr>

        <tr>
          <td>Turbidity</td>

          <td>per day</td>

          <td>per hour</td>
        </tr>
      </tbody>
    </table>
  </div>

  <div id="sample6-content" style="display:none">
    <table cellpadding="5" border="1">
      <tbody>
        <tr>
          <th>Parameter</th>

          <th>Normal Range</th>

          <th>Frequency</th>
        </tr>

        <tr>
          <td>Turbidity (per filter)</td>

          <td>0-1NTU</td>

          <td>per shift</td>
        </tr>
      </tbody>
    </table>
  </div>

  <div id="sample7-content" style="display:none">
    <table cellpadding="5" border="1">
      <tbody>
        <tr>
          <th>Parameter</th>

          <th>Normal Range</th>

          <th>Frequency</th>
        </tr>

        <tr>
          <td>pH</td>

          <td>9-10</td>

          <td>twice per shift</td>
        </tr>

        <tr>
          <td>Turbidity</td>

          <td>0-1NTU</td>

          <td>twice per shift</td>
        </tr>

        <tr>
          <td>Ca<sup>+2</sup></td>

          <td>7-8.5 g/L</td>

          <td>twice per shift</td>
        </tr>

        <tr>
          <td>Mg<sup>+2</sup></td>

          <td>7-8.5 g/L</td>

          <td>twice per shift</td>
        </tr>

        <tr>
          <td>OH<sup>-1</sup></td>

          <td>per day</td>

          <td>twice per shift</td>
        </tr>

        <tr>
          <td>CO<sub>3</sub><sup>-2</sup></td>

          <td>per day</td>

          <td>twice per shift</td>
        </tr>

        <tr>
          <td>NaCl Concentration</td>

          <td>above 290g/L</td>

          <td>twice per shift</td>
        </tr>

        <tr>
          <td>Av. Cl<sub>2</sub></td>

          <td>nil</td>

          <td>twice per shift</td>
        </tr>
      </tbody>
    </table>
  </div>

  <div id="sample8-content" style="display:none">
    <table cellpadding="5" border="1">
      <tbody>
        <tr>
          <th>Parameter</th>

          <th>Normal Range</th>

          <th>Frequency</th>
        </tr>

        <tr>
          <td>Ca<sup>+2</sup> + Mg<sup>+2</sup></td>

          <td>7-8.5 g/L</td>

          <td>per hour</td>
        </tr>

        <tr>
          <td>NaCl S.G</td>

          <td>per day</td>

          <td>twice per shift</td>
        </tr>
      </tbody>
    </table>
  </div>

  <div id="sample9-content" style="display:none">
    <table cellpadding="5" border="1">
      <tbody>
        <tr>
          <th>Parameter</th>

          <th>Normal Range</th>

          <th>Frequency</th>
        </tr>

        <tr>
          <td>pH</td>

          <td>per day</td>

          <td>per hour</td>
        </tr>
        <tr>
          <td>NaCl S.G</td>

          <td>per day</td>

          <td>per hour</td>
        </tr>
        <tr>
          <td>Ca<sup>+2</sup> + Mg<sup>+2</sup></td>

          <td>7-8.5 g/L</td>

          <td>per hour</td>
        </tr>
      </tbody>
    </table>
  </div>
  <div id="sample10-content" style="display:none">
    <table cellpadding="5" border="1">
      <tbody>
        <tr>
          <th>Parameter</th>

          <th>Normal Range</th>

          <th>Frequency</th>
        </tr>

        <tr>
          <td>Temperature</td>

          <td>65-70°C</td>

          <td>per hour</td>
        </tr>
        <tr>
          <td>NaCl S.G</td>

          <td>1.165-1.170</td>

          <td>per hour</td>
        </tr>
      </tbody>
    </table>
  </div>
  <div id="sample11-content" style="display:none">
    <table cellpadding="5" border="1">
      <tbody>
        <tr>
          <th>Parameter</th>

          <th>Normal Range</th>

          <th>Frequency</th>
        </tr>

        <tr>
          <td>Temperature</td>

          <td>80-85°C</td>

          <td>per hour</td>
        </tr>
        <tr>
        <tr>
          <td>NaOH S.G</td>

          <td>1.280-1.295</td>

          <td>per hour</td>
        </tr>
      </tbody>
    </table>
  </div>
  <div id="sample12-content" style="display:none">
    <table cellpadding="5" border="1">
      <tbody>
        <tr>
          <th>Parameter</th>

          <th>Normal Range</th>

          <th>Frequency</th>
        </tr>

          <td>NaOH S.G</td>

          <td>1.30-1.31</td>

          <td>per hour</td>
        </tr>
        <tr>
          <td>Temperature</td>

          <td>86-88°C</td>

          <td>per hour</td>
        </tr>
      </tbody>
    </table>
  </div>
  <div id="sample13-content" style="display:none">
    <table cellpadding="5" border="1">
      <tbody>
        <tr>
          <th>Parameter</th>

          <th>Normal Range</th>

          <th>Frequency</th>
        </tr>

        <tr>
          <td>pH</td>

          <td>3-4</td>

          <td>per hour</td>
        </tr>
        <tr>
          <td>NaCl S.G</td>

          <td>1.125-1.130</td>

          <td>per hour</td>
        </tr>
        <tr>
          <td>Temperature</td>

          <td>80-85°C</td>

          <td>per hour</td>
        </tr>
      </tbody>
    </table>
  </div>
  <div id="sample14-content" style="display:none">
    <table cellpadding="5" border="1">
      <tbody>
        <tr>
          <th>Parameter</th>

          <th>Normal Range</th>

          <th>Frequency</th>
        </tr>

        <tr>
          <td>pH</td>

          <td>1-2</td>

          <td>per hour</td>
        </tr>

        <tr>
          <td>Av. Cl<sub>2</sub></td>

          <td>1600-1800ppm</td>

          <td>per hour</td>
        </tr>
      </tbody>
    </table>
  </div>  
  <div id="sample15-content" style="display:none">
    <table cellpadding="5" border="1">
      <tbody>
        <tr>
          <th>Parameter</th>

          <th>Normal Range</th>

          <th>Frequency</th>
        </tr>

        <tr>
          <td>pH</td>

          <td>1-2</td>

          <td>per hour</td>
        </tr>

        <tr>
          <td>Av. Cl<sub>2</sub></td>

          <td>400-600ppm</td>

          <td>per hour</td>
        </tr>
      </tbody>
    </table>
  </div>
  <div id="sample16-content" style="display:none">
    <table cellpadding="5" border="1">
      <tbody>
        <tr>
          <th>Parameter</th>

          <th>Normal Range</th>

          <th>Frequency</th>
        </tr>

        <tr>
          <td>pH</td>

          <td>8-9</td>

          <td>per hour</td>
        </tr>
          <td>Av. Cl<sub>2</sub></td>

          <td>nil</td>

          <td>per hour</td>
        </tr>
      </tbody>
    </table>
  </div>

<script type='text/javascript'>

$(function(){
//for chrome
    $('.magnfy').mouseover(function () {
        $(this).css("-webkit-transform", "scale(1.5)"); 
    });
    $('.magnfy').mouseout(function () {
        $(this).css("-webkit-transform", "scale(1.0)");
    });
 //for FF
        $('.magnfy').mouseover(function () {
        $(this).css("transform", "scale(1.5)"); 
    });
    $('.magnfy').mouseout(function () {
        $(this).css("transform", "scale(1.0)");
    });

    // Create the tooltips only on document load
    // Use the each() method to gain access to each elements attributes
	    $('#container a').each(function () {
	     $(this).aToolTip({
		clickIt: true,
		tipContent: $('#'+$(this).attr('rel')).html(),
	    });
	});
});
</script>
  
</body>


</html>

